	<template>
<div class="leftNav">
 <el-col :span="12">

   <!-- default-active 默认选中的菜单 -->
   <!-- router="true" true表示开启路由模式 ,开启之后index值就代表路由地址 -->
    <el-menu
      :router="true"
      default-active="/home"
      class="el-menu-vertical-demo"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b">

  <el-menu-item :index="item.path" v-for="(item,index) in listData" :key="index">
        <i :class="'el-icon-'+item.ico"></i>
        <span slot="title">{{item.title}}</span>
      </el-menu-item>
    </el-menu>
  </el-col>

</div>
</template>

<script>
export default {
  data(){
    return {
      listData:[{
        title:'首页',
        ico:'s-home',
        path:'/home/'
        
      },{
        title:'会员管理',
        ico:'user-solid',
        path:'/member/'
        
      },{
        title:'供应商管理',
        ico:'s-claim',
        path:'/supplier/'
        
      },{
        title:'商品管理',
        ico:'s-goods',
        path:'/goods/'
        
      },{
        title:'员工管理',
        ico:'user',
        path:'/staff/'
        
      }]
    }
  }
}
</script>
<style scoped>
  .el-col{
  
    width: 100%;
    bottom:0;
    border-right:none;
  }
  .el-menu {
    border:none;
  }
</style>